<template>
	<view class="noteview" @click="naviToDetail">
		<image class="codefun-self-start image_2" :src="picture" />
		<view class="content-wrap">
			<text class=" font_1 text_2">{{content}}</text>
		</view>

	</view>
</template>

<script>
	export default {
		name: "noteview5W1H",
		props: {
			pram: {
				type: Object,
				default: 0
			}
		},
		data() {

			return {
				picture: "",
				content: ""
			}
		},
		mounted() {
			this.content = this.pram.content.slice(0, 20) + "..."
			this.picture = this.pram.picture

			console.log("HElloSBYUyang")
		},
		methods: {
			naviToDetail() {
				uni.navigateTo({
					url: "../../pages/noteEdit/noteEdit"
				})
			}
		}
	}
</script>

<style lang="scss">
	.noteview {

		padding-top: 34.88rpx;
		padding-bottom: 20rpx;
		width: 300rpx;
		height: 400rpx;
		background-color: #ffffff;
		border-radius: 50%;
		border: solid 8.72rpx #6073eb;
	}

	.image_2 {
		margin-left: 85rpx;
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
		 // border: 2px solid #aa55ff;
		 
	}

	.font_1 {
		font-size: 20rpx;
		font-family: AlimamaShuHeiTi;
		line-height: 33.14rpx;
		color: #1c167d;
	}

	.content-wrap {
		margin-left: 30rpx;
		height: 150rpx;
		width: 200rpx;

		display: -webkit-box;
		/* 将文本显示为块元素，并支持多行文本 */
		-webkit-line-clamp: 5;
		/* 限制显示的行数 */
		-webkit-box-orient: vertical;
		/* 垂直排列文本 */
	}

	.text_2 {
		margin-left: 3.49rpx;

	}
</style>